<!-- eslint-disable vue/valid-define-props -->

<template>
    
    <div id="lis_1">
        <ul style="width: 30%;height: 100%;">
          <h4 >生态合作</h4>
          <li v-for="(i,j) in objs.lisone" :key="j" class="text_list">
           {{ i }}
          </li>
        </ul>
          <ul style="width: 30%;height: 100%;">
          <h4 >资源中心</h4>
          <li v-for="(i,j) in objs.listwo" :key="j">
           {{ i }}
          </li>
        </ul>
        <ul style="width: 30%;height: 100%;">
          <h4 >帮助</h4>
          <li v-for="(i,j) in objs.listhree" :key="j">
           {{ i }}
          </li>
        </ul>
      </div>

</template>

<script setup lang="ts">

import {defineProps} from 'vue';

type TwoType = {
lisone:string[],
listwo:string[],
listhree:string[]
}

const {objs} =  defineProps({
objs:{
type:Object,
default:{} as {}
},
display:{
type:String,
default:'none'
}
});


</script>


<style scoped lang="scss">
*{
margin: 0;
padding: 0;
list-style: none;
}

#lis_1 {
  width: 400px;
  height: 200px;
  border: 1px solid #ccc;
  position: absolute;
  top: 40px;
  right: -197px;
  background-color: #fff;
  border-radius: 10px;
  box-shadow: 0 0 5px 2px #ccc;
  box-sizing: border-box;
  padding: 20px 50px;
  display: flex;
  justify-content: space-around;
  text-align: center;
  color: black;
  ul{
    margin-top: -10px;
  }
li{
  line-height: 30px;
  font-size: 12px;
  cursor: pointer;
}
li:hover{
  color: #1261ff;
}
}
</style>